3
תגובות

css border radius

פתח mmm ,
יש לי דיב רבוע, בגודל 200X200, בתוכו נמצאת תמונה, שיכולה להיות בגודל 200X200, אך יכולה להיות גם קטנה יותר.
אני רוצה לעגל את הפינות של התמונה, אבל:

הדיב שבתוכו נמצאת התמונה, אמור לשוות לתמונה מראה של תמונת 200X200, כך שבמקומות הריקים, קיים צבע רקע מסויים, כך שאיני יכול לעגל את הפינות של התמונה, כי בעצם התמונה "ממשיכה" עד לסוף הדיב.
מצד שני, אני לא יכול לעגל את הפינות של הדיב, כי אם תהיה בפנים תמונה בגודל 200X200 התמונה תציץ מבעד לרדיוס.

כרגע המצב הוא שנתתי לתמונה וגם לדיב רדיוס, אבל זה לא יפה.
יש איזו שהיא דרך לגרום לתמונה לא להציץ מבעד לרדיוס של הדיב?

3 תשובות

avatar ענה yonikal56 ב 03 לספטמבר 2013 #

להרחיק את הדיב מהתמונה בעזרת:
לתת לתמונה padding.

avatar ענה OrelBeY ב 03 לספטמבר 2013 #

אם התמונה לא חשובה מבחינה סמנטית, אתה יכול לשלב את התמונה ברקע (background-image), וכך היא תיחתך יחד עם הרקע.
אתה תמיד יכול פשוט להוסיף overflow: hidden;.

avatar ענה mmm ב 03 לספטמבר 2013 #

להרחיק את התמונה לא יעזור, לא רוצה שישאר רווח בין מסגרת הדיב לתמונה.
תמונת רקע לא טובה בשבילי, כי אני יאבד כוח רב בגוגל.

הפתרון שעבד לי הוא של @OrelBeY, והוא overflow: hidden.

תודה רבה!